import {Component, OnInit} from '@angular/core';
import {ContentService} from '../content.service';
import _ from 'lodash';
import {Router} from '@angular/router';

@Component({
  selector: 'app-policy-matrix',
  templateUrl: './policy-matrix.component.html',
  styleUrls: ['./policy-matrix.component.less']
})
export class PolicyMatrixComponent implements OnInit {
  isSpinning;
  matrixBlockTop = [
    {
      title: '颁布特征分析',
      contentBlock: [
        {
          imgSrc: '../../../assets/image/home/matrix/matrix2.png',
          text: '政策数量演进'
        }, {
          imgSrc: '../../../assets/image/home/matrix/matrix3.png',
          text: '政策地域分布'
        }, {
          imgSrc: '../../../assets/image/home/matrix/matrix4.png',
          text: '发布机构分布'
        }
      ]
    }, {
      title: '政策演变分析',
      contentBlock: [
        {
          imgSrc: '../../../assets/image/home/matrix/matrix5.png',
          text: '政策扩散'
        }, {
          imgSrc: '../../../assets/image/home/matrix/matrix6.png',
          text: '政策热点聚焦'
        }, {
          imgSrc: '../../../assets/image/home/matrix/matrix7.png',
          text: '机构合作发文'
        }
      ]
    }
  ];
  matrixBlockBottom = [
    {
      id: '',
      title: '科技创新体系',
      contentBlock: [
        {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix8.png',
          text: '创新要素'
        }, {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix9.png',
          text: '创新主体'
        }, {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix10.png',
          text: '创新环境'
        }, {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix11.png',
          text: '产业发展'
        }
      ]
    }, {
      id: '',
      title: '具体政策专题',
      contentBlock: [
        {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix12.png',
          text: '创新型产业用地'
        }, {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix13.png',
          text: '科学城'
        }, {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix15.png',
          text: '自由贸易区'
        }, {
          id: '',
          imgSrc: '../../../assets/image/home/matrix/matrix14.png',
          text: '科技金融'
        }
      ]
    },
  ];

  constructor(private CService: ContentService,
              private router: Router) {
  }

  ngOnInit(): void {
    this.getWordFrameTopFour();
  }

// 拿到且只拿到框表框架的前四个词表信息用于展示
  getWordFrameTopFour() {
    this.isSpinning = true;
    this.CService.getWordFrameTopFour().subscribe(res => {
      const topTwo = _.slice(res.result, 0, 2);
      if (topTwo.length < 2) {
        this.matrixBlockBottom = _.take(this.matrixBlockBottom, topTwo.length);
      }
      for (let i = 0; i < topTwo.length; i++) {
        this.matrixBlockBottom[i].title = topTwo[i].name;
        this.matrixBlockBottom[i].id = topTwo[i].id;
        const topChildFour = _.slice(topTwo[i].children, 0, 4);
        const contentBlock = this.matrixBlockBottom[i].contentBlock;
        if (topChildFour.length < 4) {
          this.matrixBlockBottom[i].contentBlock = _.take(contentBlock, topChildFour.length);
        }
        for (let j = 0; j < topChildFour.length; j++) {
          contentBlock[j].id = topChildFour[j].id;
          contentBlock[j].text = topChildFour[j].name;
        }
      }
      this.isSpinning = false;
    });
  }

  negativeTo(blockId: string, index: number) {
    this.router.navigate(['/policy-analysis-cloud'], {queryParams: {wordFrameTopId: blockId, wordFrameIndex: index}});
  }
}
